<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title>Mkup tests</title>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <script src="assets/jsunittest.js" type="text/javascript"></script>
  
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/prototype/1.6.0.2/prototype.js" type="text/javascript" charset="utf8"></script>
  <script src="../Mkup.js" type="text/javascript"></script>
  
  <link rel="stylesheet" href="assets/unittest.css" type="text/css" />
</head>
<body>

<div id="content">

  <div id="header">
    <h1>JavaScript unit test file</h1>
    <p>
      This file tests <strong>Mkup.js</strong>.
    </p>
  </div>

  <!-- Log output (one per Runner, via {testLog: "testlog"} option)-->
  <div id="testlog"></div>
  
  <!-- Put sample/test html here -->
  <div id="sample">
  </div>
</div>

<script type="text/javascript">
// <![CDATA[
	new Test.Unit.Runner({
    	
		setup: function() {},
    
    	teardown: function() {
			$('sample').innerHTML = "";
    	},
    
    	testAddingMultipleElementsAtRootLevel: function() { with(this) {
			var items = 30, 
				mkup = Mkup.mkup($('sample'));
			items.times(function(){
				mkup.element("span");
			});
			mkup.write();
			assertEqual(items, $('sample').select("span").length);
			info("Creating "+items+" <span> elements inside the target element works.");
    	}},

		testChild_String:function(){ with(this){
			var depth = 50, 
				context, 
				mkup = Mkup.mkup($('sample'));
			depth.times(function(){
				mkup.child("span");
			});
			mkup.write();
			assertEqual(depth, $('sample').select("span").length);
			context = $('sample');
			depth.times(function(idx){
				assertEqual(depth-idx, context.select("span").length);
				context = context.down("span");	
			});
			info("Creation of a "+depth+" nested <span> nodes works as expected.");
		}},
		
		testChild:function(){with(this){
			var items=10, mkup = Mkup.mkup($('sample'));
			mkup.element("ul").child();
			items.times(function(i){
				mkup.element("li").text(i);
			});
			mkup.write();
			assertEqual(items, $('sample').select("ul>li").length);
			info("Using child() without parameters makes mkup handle the next call to element() like a child() call.");
		}},
		
		testUpWithoutParameters:function(){ with(this){
			var mkup = Mkup.mkup($('sample'));
			mkup.element("div")
				.child("div")
				.child("div")
				.up()
				.element("span")
				.write();
			assertEqual(1,$('sample').select("div>span").length);
			info("Using up() puts the cursor to a higher level");
		}},
		
		testElement_String_String:function(){with(this){
			var mkup = Mkup.mkup($('sample'));
			mkup.element("span","testclass").write();
			assertEqual(1,$('sample').select("span.testclass").length);
			info("CSS classes get set correctly");
		}},
		
		testElement_String_Object:function(){with(this){
			var mkup = Mkup.mkup($('sample'));
			mkup.element("span",{className:"test",title:"title_test"}).write();
			assertEqual(1,$('sample').select("span.test[title='title_test']").length);
			info("Attributes of created nodes can be set using an object literal");
		}},
		
		testElement_String_Null_String:function(){with(this){
			var created, writeCreatedHere={}, mkup = Mkup.mkup($('sample'));
			created = mkup.element("span",null,"theName").write(writeCreatedHere);
			assertNotUndefined(created.theName);
			assert(!!created.theName.nodeName);
			assertIdentical($('sample').down("span"),created.theName);
			info("Created elements can be accessed by a given name, the null gets ignored.");
			assertIdentical(writeCreatedHere.theName,created.theName);
			info("Created elements are written to an object used as parameter to write()");
		}},
		
		testElement_String_String_String:function(){with(this){
			var created, writeCreatedHere={}, mkup = Mkup.mkup($('sample'));
			created = mkup.element("span","theCSSClass","theName").write(writeCreatedHere);
			assertNotUndefined(created.theName);
			assert(!!created.theName.nodeName);
			assertIdentical($('sample').down("span.theCSSClass"),created.theName);
			info("Created elements can be accessed by a given name and get their CSS class set as expected.");
		}},
	
		testElement_String_Object_String:function(){with(this){
			var created, mkup = Mkup.mkup($('sample'));
			created = mkup.element("div",{className:"theCSSClass", lang:"de"},"theName").write();
			assertNotUndefined(created.theName);
			assert(!!created.theName.nodeName);
			assertEqual(1,$('sample').select("div.theCSSClass[lang='de']").length);
			info("Created elements can be accessed by a given name and get their CSS class and 'lang' attribute set as expected.");
		}},
		
		testUsingTagNameAsFunctionName:function(){with(this){
			var 
				mkup = Mkup.mkup($('sample')),
				tags = ["a", "abbr", "acronym", "address", "area", "b", "base", "basefont", "bdo", "big",
				"blockquote", "br", "button", "caption", "center", "cite", "code", "col", "colgroup", "dd",
				"del", "dfn", "dir", "div",
				"dl", "dt", "em", "fieldset", "font", "form", "h1", "h2", "h3", "h4", "h5", "h6", "head", "hr",
				"html", "i", "iframe", "img", "input", "ins", "isindex", "kbd", "label", "legend", "li", "link",
				"map", "menu", "meta",
				"object", "ol", "optgroup", "option", "p", "param", "pre", "q", "s", "samp", "script", "select",
				"small", "span", "strike", "strong", "style", "sub", "sup", "table", "tbody", "td", "textarea",
				"tfoot", "th", "thead",
				"title", "tr", "tt", "u", "ul"];
			tags.each(function(tag){
				mkup[tag]();
				mkup.write();
				assertEqual(1, $('sample').select(tag).length);
				info("Calling "+tag+"() works.");
			});
		}},
		
		testUpTo:function(){with(this){
			var mkup = Mkup.mkup($('sample'));
			mkup.child("div").child("div",null,"backHere");
			$R(0,10).each(function(){
				mkup.child("span").child("b");
			});
			mkup.upTo("backHere");
			mkup.element("b");
			mkup.write();
			assertEqual(1, $('sample').select("div>b").length);
		}},
		
		testUpToTop:function(){with(this){
			var levels=20,mkup = Mkup.mkup($('sample'));
			levels.times(function(){mkup.childDiv();});
			mkup.upToTop();
			mkup.span("inside").childSpan("topLevel");
			mkup.write();
			assertEqual(1, $('sample').select("span.inside>span.topLevel").length);
		}},
		
		testMarkup:function(){with(this){
			var mkup = Mkup.mkup($('sample'));
			mkup.div().markup('<span class="testthis">Huhu</span>').write();
			assertEqual(1, $('sample').select("span.testthis").length);
		}}
  }); 
// ]]>
</script>
</body>
</html>